{% set _pageRoute = '/mder' %}
{% set _breadName = 'Content List' %}

{% extends "admin/_layouts/admin_lte.twig" %}

{% block style %}
<link rel="stylesheet" href="/assets/libs/datetimepicker/datetimepicker.min.css">
<link rel="stylesheet" href="/assets/src/admin/content/list.css">
{% endblock %}

{% block bottomScript %}
 {# {% include '_includes/asset-vue.twig' %} #}
  <script src="/assets/libs/datetimepicker/datetimepicker.min.js"></script>
  <script src="/assets/src/admin/content/content-list.js"></script>
{% endblock %}

{% block body %}

    <div class="panel panel-default">
      <!-- Default panel contents -->
      <div class="panel-heading">
        <a href="{{ path_for('content',{'action':'add'}, {'type':'blog'}) }}" class="btn btn-primary btn-xs pull-right">
            <span class="fa fa-plus"></span> {{ _globals.lang.tl('contents:create') }}
        </a>
        <h3 class="panel-title">Content list
        </h3>
      </div>
      <div class="panel-body">
        <form class="form-inline content-search">
          <div class="form-group">
            <label for="title">标题</label>
            <input type="text" class="form-control" id="title" placeholder="标题">
          </div>
          <div class="form-group">
            <label for="user">作者</label>
            <input type="text" class="form-control" id="user" placeholder="作者">
          </div>

          <div class="form-group">
            <label for="status">状态</label>
            <select class="form-control" name="status" id="status">
              <option value="all">全部</option>
              {% for index,value in statusList %}
                <option value="{{ index }}">{{ value }}</option>
              {% endfor %}
            </select>
          </div>
          <div class="form-group">
            <label for="type">类型</label>
            <select class="form-control" id="type" name="type">
                <option value="all">全部</option>
              {% for index,value in typeList %}
                <option value="{{ index }}">{{ value }}</option>
              {% endfor %}
            </select>
          </div>
          <div class="row">
            <div class="col-xs-12">
              <div class="form-group">
                <label for="time">时间字段</label>
                <select class="form-control" id="time">
                  <option>Create Time</option>
                  <option>Publish Time</option>
                </select>
              </div>
              <div class="form-group">
                <label class="sr-only" for="content-stratTime">stratTime</label>
                <div class="input-group">
                    <input type="text" class="form-control" id="content-startTime" placeholder="strat time">
                    <span class="input-group-addon"><i class="fa fa-remove"></i></span>
                </div>
              </div>
              <div class="form-group">
                <label class="sr-only" for="content-endTime">endTime</label>
                <div class="input-group">
                  <input type="text" class="form-control" id="content-endTime" placeholder="end time">
                  <span class="input-group-addon"><i class="fa fa-remove"></i></span>
                </div>
              </div>
            </div>
          </div><!-- /.row-->

          <button type="submit" class="btn btn-primary" style="margin-left: 25%;"> Go ! </button>
        </form>
      </div>

      <!-- Table -->
      <table class="table table-hover">
        <thead>
          <tr>
            <th>#ID</th>
            <th>Status</th>
            <th>Title</th>
            <th>Author </th>
            <th>Publish Time</th>
            <th>Create Time</th>
            <th>Operate</th>
          </tr>
        </thead>
        <tbody>

        {% for article in contents %}
          <tr>
            <th scope="row">{{ article.id }}</th>
            <td><span class="label label-info">{{ statusList[article.status] }}</span></td>
            <td>{{ article.title }}</td>
            <td>{{ article.username}}</td>
            <td>{{ article.publishTime|date('Y.m.d H:i') }}</td>
            <td>{{ article.createTime|date('Y.m.d H:i') }}</td>
            {# <td>{{ article.urlAlias }}</td> #}
            <td>
              <div class="btn-group btn-group-xs" role="group" aria-label="...">
                <a role="button" href="/{{ article.type }}/{{ article.urlAlias ?: article.id }}" class="btn btn-success"><span class="glyphicon glyphicon-eye-open"></span></a>
                {# <button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-remove"></span></button> #}
                <button type="button" class="btn btn-danger"><span class="glyphicon glyphicon-trash"></span></button>

                <div class="btn-group btn-group-xs" role="group">
                  <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    {# &hellip; #}
                    <span class="caret"></span>
                  </button>
                  <ul class="dropdown-menu">
                    <li><a href="#">Dropdown link</a></li>
                    <li><a href="#">Dropdown link</a></li>
                  </ul>
                </div>
              </div>
            </td>
          </tr>
        {% endfor %}

        </tbody>
      </table>

      <div class="panel-footer">
        <nav>
          <ul class="pagination" style="margin: 0">
            <li>
              <a href="#" aria-label="Previous">
                <span aria-hidden="true">&laquo;</span>
              </a>
            </li>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
            <li><a href="#">5</a></li>
            <li>
              <a href="#" aria-label="Next">
                <span aria-hidden="true">&raquo;</span>
              </a>
            </li>
          </ul>
        </nav>

      </div>
    </div>
{% endblock %}